<template>
    <z-paging>
        <view class="quanbu_bg" style="background-image: url('https://morgan.dingxians.cn/static/invited/5.png');">
            <u-sticky>
                <hedsty :headCentext="'邀请好友'"></hedsty>
            </u-sticky>
            <view class="yongjin_box">
                <view class="renshutj1_box"
                    style="background-image: url('https://morgan.dingxians.cn/static/invited/3.png');">
                    <view class="top_title_box">佣金</view>
                    <view class="shuzi_num_box">{{ propertyNum }}</view>
                    <view class="liangqu_box" @click="$no(getusersDraw_down)">领取</view>
                </view>
                <view class="renshutj_box"
                    style="background-image: url('https://morgan.dingxians.cn/static/invited/3.png');">
                    <view class="top_title_box">已邀请人数</view>
                    <view class="shuzi_num_box">{{ invitenum.length }}</view>
                </view>
            </view>

            <view class="dibu_box" style="background-image: url('https://morgan.dingxians.cn/static/invited/2.png');">
                <view class="title_bopx">
                    邀请记录
                </view>
                <view class="content_box" v-if="invitenum.length > 0">
                    <view class="dange_box" v-for="(item, index) in invitenum" :key="index">
                        <view class="text_bix">{{ item.nickname }}注册</view>
                        <view class="text_bix">{{ item.created_at }}</view>
                    </view>
                </view>
                <view v-else>
                    <empty></empty>
                </view>
            </view>

            <view class="botomss_box" style="background-image: url('https://morgan.dingxians.cn/static/invited/1.png');"
                @click="tz"></view>
        </view>


    </z-paging>
</template>
<script>
import hedsty from '../../components/hedsty.vue'
export default {
    components: {
        hedsty
    },
    data() {
        return {
            noClick: true,
            invitenum: [], //邀请列表
            propertyNum: ''
        }
    },
    onLoad() {

    },
    onShow() {
        this.getList()
    },
    methods: {
        getList() {
            this.$Request.get(this.$api.user.userInviteRewardsChild).then(res => {
                if (res.code == 200) {
                    this.invitenum = res.data.data
                    this.propertyNum = res.data.propertyNum
                }
            })
        },
        getusersDraw_down() {
            this.$Request.post(this.$api.user.usersDraw_down).then(res => {
                if (res.code == 200) {
                    this.$msg(res.msg)
                    setTimeout(() => {
                        this.getList()
                    })
                }
            })
        },
        // getTempFilePath(base64Data, image) {
        //     return new Promise((resolve, reject) => {
        //         const fs = uni.getFileSystemManager()
        //         base64Data = base64Data.split(',')[1]
        //         const fileName = 'temp_image_' + Date.now() + '.png' // 自定义文件名，可根据需要修改
        //         const filePath = uni.env.USER_DATA_PATH + '/' + fileName
        //         const buffer = uni.base64ToArrayBuffer(base64Data)
        //         fs.writeFile({
        //             filePath,
        //             data: buffer,
        //             encoding: 'binary',
        //             success: res => resolve(filePath),
        //             fail: err => reject(err)
        //         })
        //         this.$router('/userPage/invited/poster?imageSrc=' + filePath + '&image=' + JSON.stringify(image))
        //     });
        // },
        // 生成邀请海报
        tz() {
			 this.$router('/userPage/invited/poster')
            // 推广二维码
            // this.$Request.post(this.$api.share.usersGetWxCode).then(res => {
            //     if (res.code == 200) {
            //         let imageSrc = res.url
            //         uni.hideLoading()
            //         this.getTempFilePath(imageSrc, res.img)

            //     }
            // })
        }
    }
}
</script>
<style lang="scss" scoped>
.quanbu_bg {
    width: 100%;
    height: 2100rpx;
    background-size: 100% 100%;

    .yongjin_box {
        width: 100%;
        height: 170rpx;
        position: absolute;
        top: 1050rpx;
        display: flex;
        justify-content: space-around;

        .renshutj1_box {
            width: 320rpx;
            height: 170rpx;
            background-size: 100% 100%;
            box-sizing: border-box;
            padding-top: 10rpx;

            .top_title_box {
                width: 100%;
                font-family: PingFang SC;
                font-weight: 500;
                font-size: 24rpx;
                color: #FFFFFF;
                text-align: center;
                margin-bottom: 10rpx;
            }

            .shuzi_num_box {
                width: 100%;
                font-family: text1;
                font-weight: 400;
                font-size: 40rpx;
                color: #FFEDD7;
                text-align: center;
                margin-bottom: 10rpx;
            }

            .liangqu_box {
                margin: auto;
                width: 180rpx;
                height: 50rpx;
                background: linear-gradient(180deg, #FF4242, #FF6666);
                border-radius: 44rpx;
                font-family: PingFang SC;
                font-weight: bold;
                font-size: 28rpx;
                color: #FFFFFF;
                line-height: 50rpx;
                text-align: center;
            }
        }

        .renshutj_box {
            width: 320rpx;
            height: 170rpx;
            background-size: 100% 100%;
            box-sizing: border-box;
            padding-top: 32rpx;

            .top_title_box {
                width: 100%;
                font-family: PingFang SC;
                font-weight: 500;
                font-size: 24rpx;
                color: #FFFFFF;
                text-align: center;
                margin-bottom: 13rpx;
            }

            .shuzi_num_box {
                width: 100%;
                font-family: text1;
                font-weight: 400;
                font-size: 80rpx;
                color: #FFEDD7;
                text-align: center;
            }
        }
    }


    .dibu_box {
        width: 690rpx;
        height: 608rpx;
        background-size: 100% 100%;
        left: 0;
        right: 0;
        margin: auto;
        position: absolute;
        top: 1244rpx;
        box-sizing: border-box;
        padding-top: 49rpx;

        .title_bopx {
            width: 100%;
            font-family: text1;
            font-weight: bold;
            font-size: 42rpx;
            color: #FFEDD7;
            margin-bottom: 52rpx;
            text-align: center;
        }

        .content_box {
            width: 100%;
            height: 401rpx;
            overflow: hidden;
            overflow-y: auto;

            .dange_box {
                width: 100%;
                height: 25rpx;
                display: flex;
                justify-content: space-between;
                align-items: center;
                box-sizing: border-box;
                padding: 0 46rpx;
                margin-bottom: 50rpx;

                .text_bix {
                    height: 25rpx;
                    font-family: PingFang SC;
                    font-weight: 500;
                    font-size: 26rpx;
                    color: #FFFFFF;
                    line-height: 25rpx;
                }
            }
        }
    }

    .botomss_box {
        width: 500rpx;
        height: 100rpx;
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        top: 1902rpx;
        background-size: 100% 100%;

    }

}
</style>